INSTRUCCIONES

Instalacin bsica: http://chicablogger.com/instalar-una-plantilla-blogger-en-la-nueva-interfaz/

1. Configurando el slider. Ve a Diseo/Edicin de HTML y encuentra el siguiente cdigo:


<!-- Featured Content Slider Started -->

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<div class='fp-slider clearfix'>
<div class='fp-slides-container clearfix'>

<div class='fp-slides'>

<!-- Slide 1 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='http://4.bp.blogspot.com/-2Q-L1qEHvqI/T9VvvpyqDvI/AAAAAAAAD0Q/EFH-rO70nII/s1600/1.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 1 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 1 Code End -->

<!-- Slide 2 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='http://4.bp.blogspot.com/-HsbaNXyHZS0/T9VvwAY8xGI/AAAAAAAAD0o/Hmp6HQ5PBpc/s1600/2.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 2 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 2 Code End -->

<!-- Slide 3 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='http://3.bp.blogspot.com/-2jxUF42w0bM/T9Vvv5fIJTI/AAAAAAAAD0c/yI8wvJoysJg/s1600/3.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 3 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 3 Code End -->

<!-- Slide 4 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='http://4.bp.blogspot.com/-c7weE75eTIU/T9VvwcUvPEI/AAAAAAAAD00/pHwJ_SfJxoI/s1600/4.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 4 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 4 Code End -->

<!-- Slide 5 Code Start -->
<div class='fp-slides-items'>
<div class='fp-thumbnail'>
<a href='#'><img src='http://3.bp.blogspot.com/-moysbkoGZNs/T9Vvw0zQJMI/AAAAAAAAD1A/CtEdTTkro2w/s1600/5.jpg'/></a>
</div>
<div class='fp-content-wrap'>
<div class='fp-content'>
<h3 class='fp-title'>
<a href='#'>This is default featured slide 5 title</a>
</h3>
<p>
Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.
</p>
</div>
<div class='fp-prev-next-wrap clearfix'>
    <a class='fp-next' href='#fp-next'/>
    <a class='fp-prev' href='#fp-prev'/>
</div>
</div>
</div>
<!-- Slide 5 Code End -->

</div>

<div class='fp-nav'>
    <span class='fp-pager'/>
</div>  
            
</div>
</div>
<div style='clear:both;'/>

</b:if></b:if>

<!-- Featured Content Slider -->


Puedes reemplazar los enlaces de las imgenes por las tuyas y configurar las descripciones de tus posts y links. Para enlazar cada imagen a un post de tu blog, debers poner tu enlace en vez del signo gato "#" (sin comillas) que aparece. Las imgenes deben tener 550300 pxeles.





2. Configurando los botones social media. Ve a Diseo/Edicin de HTML, click en expandir plantillas de artilugios y encuentra el siguiente cdigo:



<div id='social'>
<a href='#'>
<img alt='Twitter' src='http://3.bp.blogspot.com/-x2flgWRkaFc/T9WHo0xI6jI/AAAAAAAAD2o/twIwHAECUQo/s1600/twitter.png' title='Twitter'/></a>
<a href='#'>
<img alt='Feed' src='http://4.bp.blogspot.com/-JJVb4fwuDWw/T9WHpCnIhiI/AAAAAAAAD20/JQJMglOOrKI/s1600/rss.png' title='RSS'/></a>
<a href='#'>
<img alt='Facebook' src='http://1.bp.blogspot.com/-Jo1kcRSd580/T9WHpbw4hiI/AAAAAAAAD3A/aedZdo_cw5U/s1600/facebook.png' title='Facebook'/></a>
</div>


Reeemplaza cada # por la direccin correspondiente de tu Twitter, Facebook o Feedburner.



3. El cdigo para el buscador. Por favor, pega lo siguiente en un nuevo gadget de HTML/Javascript:



<div id='searchform'>
<form expr:action='data:blog.homepageUrl + &quot;search/&quot;' id='search' method='get'>
<div><input id='s' name='q' type='text' value=''/>
<input id='searchsubmit' type='submit' value='Buscar'/>
</div>
</form>
</div>



4. Configura los mens desde Diseo/Elementos de la pgina.


5. Disfruta! Recuerda que puedes usar la plantilla libremente siempre y cuando respetes los crditos de autor. Cualquier configuracin personalizada corre por cuenta del usuario.


